<template>
  <div class="tmp" ref="newsinfo">
    <div>
      <div class="title">
        <h2>{{newsinfo.title}}</h2>
        <span>{{newsinfo.add_time | timefmt}}</span>
        <span>点击量:{{newsinfo.click}}</span>
      </div>
      <div class="content" v-html="newsinfo.content">
      </div>
      <ratings :newsid="newsid"></ratings>
    </div>
  </div>
</template>
<script>
  import common from '../common/common.js';
  import Bscroll from 'better-scroll';
  import Vue from 'vue';
  import ratings from './ratings.vue';



  export default{
    components:{
        ratings:ratings
    },
    data(){
      return {
        newsinfo: {},
        newsid:0,
      }
    },
    methods: {
      getnewsinfo(){
        let url = common.apiUrl +'/api/getnew/'+ this.$route.params.newsId;
        this.$http.get(url).then(res => {
          if(res.body.status!=0){
              return;
          }
          this.newsinfo=res.body.message[0];
          //this.gundong();
        })
      },
      gundong(){
        this.$nextTick(()=>{
            if (!this.scroll){
              this.scroll = new Bscroll(this.$refs.newsinfo,{
                click:true
              })
            }else {
                this.scroll.refresh();
            }

        })
      }
    },
    created(){
        this.newsid=this.$route.params.newsId;
      this.getnewsinfo();
    }
  }
</script>
<style scoped>
  .tmp{
    overflow: auto;
  }
  .title{
    padding: 10px;
    border-bottom: 1px solid rgba(0,0,0,.2);
  }
  .title h2{
    font-size: 16px;
    color: rgba(0,0,0,.8);
    text-align: center;
  }
  .title span{
    font-size: 10px;
    color: rgba(0,0,0,.3);
  }
  .content{
    padding: 15px;
  }
</style>

